#include("common.html")
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>品牌列表</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <!-- 引入样式 -->
    <link rel="stylesheet" href="#(tpath)/static/css/element.css">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/basic.css">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/filter.css">
    <script src="#(tpath)/static/js/jquery.js"></script>
    <script src="#(tpath)/static/js/common.js"></script>
  </head>
  
  <body class="">
	#include("header.html")
    <style type="text/css">#brand{ background-color: #f6f6f6; } .allwarp .breadcrumbs { clear: both; height: 44px; line-height: 44px; color: #999; width: 1200px; margin: 0 auto; } .allwarp .clearfix { zoom: 1; } .allwarp .breadcrumbs li { float: left; font-size: 12px; } .allwarp .breadcrumbs a, .breadcrumbs a:visited { color: #737574; } .brandstyle { background: #fff; float: left; margin: 0 15px 15px 0px; width: 245px; height: 80px; padding: 20px; display: block; transition: box-shadow .3s; } .brandstyle strong, .brandstyle .intro .brand_pro { transition: color .3s; } .brandstyle strong, .brandstyle .intro .brand_pro { transition: color .3s; } .brandstyle .intro .brand_pro { width: 220px; text-align: left; color: #656156; overflow: hidden; margin-top: 5px; line-height: 20px; font-size: 13px; } .pagination { display: inline-block; padding-left: 0; margin: 20px 0; border-radius: 4px; } .pagination > li { display: inline; } .pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span { border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .pagination > li:first-child > a, .pagination > li:first-child > span { margin-left: 0; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 2; color: #fff; cursor: default; background-color: #f15151; border-color: #f15151; } .pagination-sm > li > a, .pagination-sm > li > span { padding: 5px 10px; font-size: 14px; } .pagination > li > a, .pagination > li > span { position: relative; float: left; padding: 6px 12px; margin-left: -1px; line-height: 1.42857143; color: #666; text-decoration: none; background-color: #fff; border: 1px solid #ddd; } .brand-title{ color:#626760; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-size: 14px; } .cart-thead{ display: block; padding: 45px 0; background: #fff; border: 1px solid #e9e9e9; box-sizing: border-box; margin: 15px 0px; } .message-img{ margin-left: 50px; margin-right: 100px; float: left; } .message-hint{ font-size: 30px; color: #b82831; } .message-goods{ line-height: 30px; color: #6d6d6d; font-size: 14px; } .message-a{ line-height: 30px; font-size: 14px; } .message-a:hover{ color: #6d6d6d; } a{ outline: none; cursor: pointer; color: #428bca; }</style>
    <div id="brand">
      <div class="allwarp">
        <div class="breadcrumbs fl" style="width: 500px;">
          <ul class="clearfix">
            <li class="home">
              <a href="#" title="首页">首页</a>
              <span></span>
            </li>
            <li class="home">&nbsp;&nbsp;&gt;&nbsp;&nbsp;
              <a href="#" title="品牌列表">品牌列表</a>
              <span></span>
            </li>
          </ul>
        </div>
        <div class="cl"></div>
        
        <!-- list start -->
        #for(brand : page.list)
        <a href="#(brand.path)" class="brandstyle">
          <div class="span-5 items">
            <dl>
              <dt class="img fl" style="text-align: center; margin: 15px 0px;">
                <img src="#(imageUrl(brand.image))" width="90" height="50"></dt>
              <dd class="intro textcenter fl" style="margin-left: 10px; width: 140px;">
                <strong class="brand-title">#(brand.name)</strong></dd>
            </dl>
          </div>
        </a>
        #end
        <!-- list end -->
        
        <div class="cl"></div>
        <div class="fr" style="margin-right: 14px; margin-bottom: 10px;">
	        #if(page.pageNumber>1)
          <button type="button" class="el-button el-button--primary" onclick="location.href='#(base)/brand/list?pageNumber=#(page.pageNumber-1)'">
            <!---->
            <!---->
            <span>上一页</span></button>
             #end
			#if(page.pageNumber<page.totalPage)
          <button type="button" class="el-button el-button--primary" onclick="location.href='#(base)/brand/list?pageNumber=#(page.pageNumber+1)'">
            <!---->
            <!---->
            <span>下一页</span></button>
            #end
        </div>
      </div>
      <div class="cl"></div>
    </div>
	#include("footer.html")
  </body>
</html>